

<template>
    <div class="search-wrap">
        <!-- <aside class='search-btn'>
            <ButtonGroup>
                <Button size='large'  v-for="(item,index) in btnsearch" :key="index" :type="formData.EQ_type===item.value?'primary':'ghost'" @click="handleBtn('EQ_type',item.value)">{{item.label}}</Button>
            </ButtonGroup>
        </aside> -->
        <article class="search-main clearfix">
            <div class="pull-left">
                <Button type='primary' @click="handleModal('error')" >异常处理</Button>
                <Button type='info' @click="handleModal('export')" >导出</Button>
            </div>
            <div class="pull-right">
                <Form :label-width="100" inline>
                    <FormItem label='组织'>
                        <Select  v-model="formData.EQ_organizationId" filterable clearable>
                            <Option v-for="item in systemlist" :value="item.id" :key="item.id">{{item.name}}</Option>
                        </Select>
                    </FormItem>
                     <FormItem label='tracking No'>
                        <Input  v-model="formData.EQ_trackingNo"/>
                    </FormItem>
                    <FormItem  label='创建时间' >
                        <DatePicker type="daterange"  v-model="formData.BT_createdAt"></DatePicker>
                    </FormItem>
					<FormItem :label-width="1">
                        <Button type="primary" @click="update" icon="ios-search-strong">搜索</Button>
                        <Button @click="reset" icon='refresh'>重置</Button>
                    </FormItem>
                </Form>
            </div>
        </article>
    </div>
</template>

<script>

import { mapState } from 'vuex';

export default {
    data() {
        return {
            // btnsearch: [{
            //     value: 0,
            //     label: '取值异常'
            // }, {
            //     value: 1,
            //     label: '计费异常'
            // }, {
            //     value: null,
            //     label: '所有'
            // }],
            formData: {
                EQ_type: null,
                // EQ_organizationId: '',
                // BT_createdAt: '',
            },
        }
    },
    mounted() {
        this.update();
    },
    computed: {
        ...mapState(['systemlist'])
    },
    methods: {
        handleModal(type, id) {
            this.$parent.handleOperate(id, type);
        },
        // handleBtn(key, val) {
        //     this.$set(this.formData, key, val);
        //     this.update();
        // },
        update() {
            const search = { ...this.formData };
            search.BT_createdAt = (search.BT_createdAt && search.BT_createdAt[0]) ? (DateFormat(search.BT_createdAt[0], 'yy-mm-dd') + ' ~ ' + DateFormat(search.BT_createdAt[1], 'yy-mm-dd')) : '';
            this.$emit('on-update', { search });
        },
        reset() {
            this.formData = {
                EQ_organizationId: '',
                BT_createdAt: '',
                EQ_trackingNo: '',
                EQ_type: null,
            };
            this.$emit('on-update', { search: this.formData });
        },
    },
};

</script>
